<script>
// 记一笔
let recordWriteComponent = {
    template: `
<div id="tallyRecordBox">
    <div id="operationArea"style="text-align:center">
        <el-row>
        <el-button-group justify="center">
            <el-button icon="el-icon-plus" v-if="tallyAddType == 10" type="primary" size="medium">记收入</el-button>
            <el-button icon="el-icon-plus" v-if="tallyAddType != 10" type="default" size="medium" @click="setTallyAddType(10)">记收入</el-button>
            <el-button icon="el-icon-minus" v-if="tallyAddType == 20" type="primary" size="medium">记支出</el-button>
            <el-button icon="el-icon-minus" v-if="tallyAddType != 20" type="default" size="medium" @click="setTallyAddType(20)">记支出</el-button>
            <el-button icon="el-icon-refresh" v-if="tallyAddType == 30" type="primary" size="medium">记转账</el-button>
            <el-button icon="el-icon-refresh" v-if="tallyAddType != 30" type="default" size="medium" @click="setTallyAddType(30)">记转账</el-button>
        </el-button-group>
        </el-row>
    </div>
                        <div class="tallyRecordForm" >
                            <el-row>
								<el-col :span="24">
									<el-form :inline="true"
                                             :model="tallyRecordForm"
                                             :rules="tallyFormRules"
                                             class="form-inline recordForm"
                                             ref="recordForm"
                                    >
									<el-col :span="24">
										<el-col :span="8">
                                       
                                        <el-tooltip class="item" effect="light" :content="smallToBig(tallyRecordForm.amount)" placement="top">
										<el-form-item label="金额" prop="amount">
                                            <el-input :disabled="material_lists.length > 0" placeholder="0.00" v-model="tallyRecordForm.amount"> <template slot="append">元</template></el-input>
                                        </el-form-item>
                                        </el-tooltip>
										</el-col>

                                        <el-col :span="8">
                                            <el-form-item label="时间" :required="true">
                                                <el-date-picker class="datePicker" v-model="tallyRecordForm.dateR" placeholder="选择日期" value-format="yyyy-MM-dd"></el-date-picker>
                                            </el-form-item>
                                        </el-col>
										<el-col :span="8">
										<el-form-item prop="account_id">
                                            <span slot="label">{{ tallyAddType == 30 ? "转出":"账户" }}</span>
                                            <el-select placeholder="账户" clearable filterable default-first-option
                                                       ref="accountTpl"  @visible-change="v => selectVisibleChange(v,'accountTpl',selectAddAccount)" @change="selectDisposeCode"
                                                       v-model="tallyRecordForm.account_id">
                                                <el-option
                                                        v-for="item in accountList"
                                                        :key="item.id"
                                                        :label="item.title"
                                                        :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
										</el-col>
										<el-col :span="8">
                                        <el-form-item prop="account_dst_id" v-if="tallyAddType == 30">
                                            <span slot="label">转入</span>
                                            <el-select placeholder="转入账户" clearable filterable
                                                       default-first-option
                                                       ref="accountTpl2"  @visible-change="v => selectVisibleChange(v,'accountTpl2',selectAddAccount)" @change="selectDisposeCode"
                                                       v-model="tallyRecordForm.account_dst_id">
                                                <el-option
                                                        v-for="item in accountList"
                                                        :key="item.id"
                                                        :label="item.title"
                                                        :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
										</el-col>
										<el-col :span="8">
                                        <el-form-item prop="category_id"
                                                      v-if="tallyAddType == 10 || tallyAddType == 20" label="分类">
                                        <el-cascader
                                         v-model="se_cate"
                                        :options="categoryListForOptions"></el-cascader>
                                        </el-form-item>
                                        </el-col>
										<el-col :span="8">

                                        <el-form-item v-if="tallyAddType != 30"
:label="tallyAddType == 10 ? '客户' : '供应商'">
                                            <el-select :placeholder="tallyAddType == 10 ? '客户' : '供应商'" clearable
                                                        filterable default-first-option @change="selectDisposeCode"
                                                        ref="storeTpl"  @visible-change="v => selectVisibleChange(v,'storeTpl',selectAddStore)"  v-model="tallyRecordForm.store_id">
                                                <el-option
                                                        v-for="item in storeList"
                                                        :key="item.id"
                                                        :label="item.title"
                                                        :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
										</el-col>

										<el-col :span="8">
                                        <el-form-item label="员工">
                                            <el-select  placeholder="员工" clearable filterable default-first-option
                                                        ref="memberTpl"  @visible-change="v => selectVisibleChange(v,'memberTpl',selectAddMember)" @change="selectDisposeCode"
                                                        v-model="tallyRecordForm.member_id">
                                                <el-option
                                                        v-for="item in memberList"
                                                        :key="item.id"
                                                        :label="item.name"
                                                        :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
										</el-col>
										<el-col :span="8">
                                        <el-form-item label="项目">
                                            <el-select  placeholder="项目" clearable filterable
                                                        default-first-option
                                                        ref="projectTpl"
                                                        @visible-change="v => selectVisibleChange(v,'projectTpl',selectAddProject)" @change="selectDisposeCode"
                                                        v-model="tallyRecordForm.project_id">
                                                <el-option
                                                        v-for="item in projectList"
                                                        :key="item.id"
                                                        :label="item.title"
                                                        :value="item.id">
                                                </el-option>
                                            </el-select>
                                        </el-form-item>
										</el-col>


                                        <el-col :span="8" v-if="tallyAddType != 30">

                                        <el-form-item label="材料" >
                                           <el-row>
                                                <span style="cursor: pointer;color:#409EFF" @click="addMaterialRecord()">
                                                    <i class="el-icon-plus"></i>
                                                    <span>添加材料</span>
                                                </span>
                                           </el-row>
                                        </el-form-item>
										</el-col>



                                        <el-col :span="8" v-if="tallyAddType != 30">

                                        <el-form-item label="操作" >
                                           <el-row>

                                                <el-radio v-model="is_gua" :label="0">否</el-radio>
                                                <el-radio v-model="is_gua" :label="1">{{tallyAddType == 10 ? '应收' : '应付'}}</el-radio>
                                                <el-radio v-model="is_gua" :label="2">{{tallyAddType == 10 ? '预收' : '预付'}}</el-radio>
                                            </el-row>
                                        </el-form-item>
										</el-col>









                                    </el-col>
                                    <el-col :span="24">
                                        <el-col :span="12">
                                            <el-form-item label="备注">
                                                <el-input class="tallyMemoInput" type="textarea" :autosize="{ minRows: 4, maxRows: 8}" maxlength="255" show-word-limit placeholder="备注" v-model="tallyRecordForm.memo"></el-input>
                                            </el-form-item>
                                        </el-col>
                                        <el-col :span="12">
                                            <p style="margin-bottom: 10px;">
                                                <el-link :underline="false" type="info"  @click="showImgUploadBox = !showImgUploadBox"><i class="el-icon-paperclip"></i>&nbsp;添加图片或附件 <i class="el-icon-arrow-down"></i></el-link>
                                                <el-upload v-if="showImgUploadBox" accept="image/*,.docx,.xlsx,.pptx,.doc,.xls,.ppt,application/vnd.ms-excel,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/zip,application/rar,application/pdf"
                                                           action="/api/upload/file" :headers="upHeaders"
                                                           :before-upload="recordFormFileBeforeUpload"
                                                           :file-list="recordFormFileList"
                                                           :on-success="recordFormFileUploadSuccess"
                                                           :on-remove="recordFormFileRemove"
                                                           list-type="picture-card" :limit="3">
                                                    <i class="el-icon-plus"></i>
                                                </el-upload>
                                                <el-dialog :visible.sync="dialogVisible">
                                                    <img width="100%" :src="dialogImageUrl" alt="">
                                                </el-dialog>
                                            </p>
                                        </el-col>
                                        <el-col :span="24">
										<p style="text-align:center;margin-bottom: 20px;">
										<el-button type="success" @click="handleRecordForm(1)"><i class="el-icon-upload"></i> 保 存</el-button>
										<el-button type="primary" @click="handleRecordForm(2)"><i class="el-icon-reset"></i> 保 存 再 记</el-button>
										</p>
										</el-col>
									</el-col>
									</el-form>
								</el-col>
                            </el-row>

                            <div class="recordListBox">
                                        <el-card class="box-card" style="cursor: initial;">
                                            <div slot="header" class="clearfix">
                                                <span>账目清单 </span>
                                                <el-divider direction="vertical"></el-divider>
                                                <span> 最近10条 </span>
                                            </div>
        <div class="recordTable">
        <template>
        <el-table :data="recordListRecent" border stripe>
        <el-table-column type="index">
        </el-table-column>
        <el-table-column prop="tally_time" sortable width="150px;"
        label="日期/类别">
        <template slot-scope="scope">
        <p><i class="el-icon-time"></i>
        <span>{{ scope.row.tally_time.substring(0,10) }}</span>
        </p>
        <p>{{ scope.row.type_txt}} -{{ scope.row.category_name }} </p>
        </template>
        </el-table-column>
        <el-table-column prop="account_name" label="金额/账户">
        <template slot-scope="scope">
        <p v-if="scope.row.type==10" class="amount-in">
        <span class="orange">+ {{ scope.row.amount }}</span>
        </p>
        <p v-if="scope.row.type==20" class="amount-out">
        <span class="green">- {{ scope.row.amount }}</span>
        </p>
        <p v-if="scope.row.type==30" class="amount-trans">
        <span class="grey">{{ scope.row.amount }}</span>
        </p>
        <p v-if="scope.row.type==30">{{ scope.row.account_name}} <i class="el-icon-right"></i> {{ scope.row.account_dst_name}} </p>
        <p v-else>{{ scope.row.account_name}} </p>
        </template>
        </el-table-column>
        <el-table-column prop="store_name" label="客户/供应商"></el-table-column>
        <el-table-column prop="project_name" label="项目"></el-table-column>
        <el-table-column prop="project_name" label="材料">
        <template slot-scope="scope" v-if="scope.row.material_json!= ''">
            <a href="javascript:" style="color: skyblue" @click="lookMaterial(scope.row.material_json)">查看材料</a>
        </template>
        </el-table-column>
        <el-table-column prop="member_name" label="员工"></el-table-column>
        <el-table-column prop="memo" label="备注"></el-table-column>
        <el-table-column prop="extra" label="附件">
        <template slot-scope="scope">
        <span v-for="(item,iai) in scope.row.attachment" >
        <a :href="item.file_name" target="_blank" class="attachLink">
        附{{ ++iai }}
        </a>&nbsp;
        </span>
        </template>
        </el-table-column>
        <el-table-column prop="state_txt" label="状态">
        <template slot-scope="scope">
            <el-tag v-if="scope.row.state == '1'" type="success" size="mini">{{scope.row.state_txt}}</el-tag>
            <el-tag v-if="scope.row.state == '0'" type="info" size="mini">{{scope.row.state_txt}}</el-tag>
            <el-tag v-if="scope.row.state == '-1'" type="warning" size="mini">{{scope.row.state_txt}}</el-tag>
        </template>    
        </el-table-column>
        <el-table-column prop="state_txt" label="审核">
        <template slot-scope="scope">
        <div v-if="scope.row.state==0 && currentTally.role!='accountant'" >
        <span class="recordOptBtn primary" @click="auditRecord(scope.row,1)">
        <i class="el-icon-check"></i>&nbsp;</span>
        <span class="recordOptBtn primary" @click="auditRecord(scope.row,-1)">
        <i class="el-icon-close"></i>&nbsp;
        </span>
        </div>
        </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="100px" v-if="currentTally.role!='cashier' && currentTally.role!='viewer' ">
        <template slot-scope="scope">
        <span class="recordOptBtn primary" @click="editRecord(scope.row)">
        <i class="el-icon-edit"></i>&nbsp;
        </span>
        <span v-if="!(scope.row.state!=0 && currentTally.role=='accountant')" class="recordOptBtn danger" @click="delRecord(scope.$index,scope.row)">
        <i class="el-icon-delete-solid"></i>&nbsp;
        </span>
        </template>
        </el-table-column>
        </el-table>
        </template>
        </div>
        </el-card>
        </div>
        </div>
    <!--账户编辑表单框------>
    <account-form :dialogShow="accountFormShow" :formRow="{}" @modalClose="accountFormShow=false"></account-form>
    <!--类别编辑表单框------>
    <category-form :dialogShow="categoryFormShow" :formRow="{}" @modalClose="categoryFormShow=false" :category-list-for-type="categoryList" :category-type="tallyAddType==10?1:2"></category-form>
    <!--客户/供应商编辑表单框------>
    <store-form :dialogShow="storeFormShow" :formRow="{}" @modalClose="storeFormShow=false" :store-type="tallyAddType==10?1:2"></store-form>
    <!--项目编辑表单框------>
    <project-form :dialogShow="projectFormShow" :formRow="{}" @modalClose="projectFormShow=false"></project-form>
    <!--成员编辑表单框------>
    <member-form :dialogShow="memberFormShow" :formRow="{}" @modalClose="memberFormShow=false"></member-form>
    <!--账单编辑表单框------>
    <record-form :dialogShow="recordDialog" :formRow="recordForm" @modalClose="recordModalClose" @getRecordList="getRecordListRecent"></record-form>
    <!--  绑定材料  -->
    <record-material-form ref="record_material_ref" :dialogShow="recordMaterialFormDialog" @confirmData="confirmData" @modalClose="recordMaterialModalClose"></record-material-form>
    <!-- 查看材料   -->
    <look-material-details :dialogShow="lookMaterialDetailsDialog" :recordList="material_json_data"   @modalClose="lookMaterialModalClose"></look-material-details>
</div>
    `,
    computed: {
        currentTallyId() {
            return this.$store.state.currentTallyId
        },
        currentTally () {
            return this.$store.state.currentTally
        },
        accountList() {
            return this.$store.state.accountList
        },
        categoryListIn() {
            return this.$store.state.categoryListIn
        },
        categoryListOut() {
            return this.$store.state.categoryListOut
        },
        categoryList() {
            if(this.tallyAddType===10) return this.categoryListIn
            if(this.tallyAddType===20) return  this.categoryListOut
        },
        categoryListForOptions(){


           let options = []
           let origin_datas = this.categoryList;

           for (let i=0;i<origin_datas.length;i++){
               if(origin_datas[i]['children']===undefined){
                    continue;
               }
                let itemData = {
                   'label':origin_datas[i]['title'],
                    'value':origin_datas[i]['id'],
                    'children':[]
                };
                for (let a = 0;a<origin_datas[i]['children'].length;a++){
                    let itemVItem = {
                        'label':origin_datas[i]['children'][a]['title'],
                        'value':origin_datas[i]['children'][a]['id'],
                    };
                    if(origin_datas[i]['children'][a]['children'] !== undefined){
                        itemVItem['children'] = [];
                        for (let z=0;z<origin_datas[i]['children'][a]['children'].length;z++){
                            itemVItem['children'].push({
                                'label':origin_datas[i]['children'][a]['children'][z]['title'],
                                'value':origin_datas[i]['children'][a]['children'][z]['id'],
                            });
                        }
                    }
                    itemData['children'].push(itemVItem);
                }
               options.push(itemData);
           }
           return options;
        },

        customList() {
            return this.$store.state.customList
        },
        gysList() {
            return this.$store.state.gysList
        },
        storeList() {
            if(this.tallyAddType===10) return this.customList
            if(this.tallyAddType===20) return this.gysList
        },
        memberList() {
            return this.$store.state.memberList
        },
        projectList() {
            return this.$store.state.projectList
        }
    },
    data:function(){
        return {
            material_json_data:[],
            material_lists:[],
            lookMaterialDetailsDialog:false,
            recordMaterialFormDialog:false,
            recordDialog:false,
            dayDialog:false,
            recordForm:{},
            showImgUploadBox:true,
            recordFormFileList: [],
            upHeaders:{
                token: loginToken
            },
            accountFormShow: false,
            categoryFormShow: false,
            storeFormShow: false,
            projectFormShow: false,
            memberFormShow: false,
            dialogImageUrl: '',
            dialogVisible: false,
            tallyAddType: 10,
            recordListRecent:[],
            is_gua:0,
            tallyRecordForm: {
                dateR:CurrDateR,
                timeR:CurrTimeR,
                amount:'',
                is_yushou:0
            },
            se_cate:[],
            tallyFormRules: {
                amount: [
                    { required: true, message: '请输入金额', trigger: 'blur' }
                ],
                account_id: [
                    { required: true, message: '请选择账户', trigger: 'blur' }
                ],
                account_dst_id: [
                    { required: true, message: '请选择转入账户', trigger: 'blur' }
                ],
                category_id: [
                    { required: true, message: '请选择类别', trigger: 'blur' }
                ],
            },
        }
    },
    mounted () {
        this.getRecordListRecent()
    },
    methods:{
        lookMaterial(json_data){
            console.log(json_data)
            if(json_data == ''){
                this.material_json_data = []
            }else{
                this.material_json_data = JSON.parse(json_data)
            }
            this.lookMaterialDetailsDialog = true
        },
        lookMaterialModalClose(){
          this.lookMaterialDetailsDialog = false;
        },
        confirmData(value){
            //没有材料
            if(value != undefined){
                this.material_lists = value['list']
                this.tallyRecordForm.amount = value['money']
            }else{
                this.material_lists = []
                this.tallyRecordForm.amount = 0
            }
        },
        addMaterialRecord(){
          this.recordMaterialFormDialog = true;
        },
        recordMaterialModalClose(){
            this.recordMaterialFormDialog = false;
        },
        selectDisposeCode(){
            this.$forceUpdate()
        },
        getRecordListRecent(){
            let that = this
            axios.get('/api/tally-record/lists',{
                method: 'get',
                headers: {'token': loginToken},
                params: {'limit':10,'offset':0,'tally_id':that.currentTallyId}
            }).then(function(res) {
                if(res.data.status === 'success'){
                    that.recordListRecent = res.data.data.data
                }else{
                    that.showTips('error','解析数据失败:'+res.data.error_message)
                }
            })
        },
        recordModalClose(){
            this.recordDialog = false
        },
        recordFormFileBeforeUpload(file){
            console.log(file)
        },
        recordFormFileUploadSuccess(response, file, fileList){
            if(response.status === 'success') {
                file.url = response.data.url
                this.recordFormFileList.push(file)
            }else{
                this.recordFormFileList.pop()
                this.showTips('error','上传失败:'+response.error_message)
            }
        },
        recordFormFileRemove(file, fileList){
            this.recordFormFileList = fileList
        },
        handleRecordForm(valueType){
            let that = this
            // if(this.material_lists.length > 0 && (this.is_gua > 1)){
            //     that.showTips('error','(预收/预付)不能选择材料')
            //     return;
            // }
            //到期了
            if(this.$store.state.day < 0){
                this.$store.state.buyTallyShow = true;
                return;
            }
            let formCheck = true
            that.tallyRecordForm['category_id'] = that.se_cate[that.se_cate.length-1];
            this.$refs['recordForm'].validate((valid) => {
                if (!valid) {
                    formCheck = false
                    console.log('error submit!!');
                    return false;
                }
            });
            if(!formCheck) {
                that.showTips('error','请填写必填项目')
                return false;
            }


            let postUrl = '/api/tally-record/add'
            let postData = that.tallyRecordForm
            let attachment = []
            that.recordFormFileList.forEach(v=>{
                attachment.push(v.url)
            });
            postData.tally_id = that.currentTallyId // 当前账本ID
            postData.type = this.tallyAddType // 收支类型
            postData.tally_time = postData.dateR + ' '+ postData.timeR //拼账单时间
            postData.attachment = attachment.join(',')

            if(this.is_gua == 1){
                postData.is_gua = true;
                postData.is_yushou = 0;
            }else if(this.is_gua == 2){
                postData.is_gua = false;
                postData.is_yushou = true;
            }else if(this.is_gua == 0){
                postData.is_gua = false;
                postData.is_yushou = false;
            }






            if((postData.is_gua || postData.category_id == 98 || postData.category_id == 99)  && postData.is_yushou){
                that.showTips('error','(应收/应付)和(预收/预付)只能选一个')
                return;
            }
            postData['material_json'] = '';
            if(this.material_lists.length > 0){
                postData['material_json'] = JSON.stringify(this.material_lists);
            }


            axios.post(postUrl,postData,{
                headers: {'token': loginToken},
            }).then(function(res) {
                if(res.data.status === 'success'){
                    that.showTips('success','操作成功~')
                    if(valueType == 1){
                        that.tallyRecordForm = {
                            dateR:CurrDateR,
                            timeR:CurrTimeR,
                            is_gua:0,
                            category_id:[],
                        }
                        that.se_cate = []
                        that.$refs.record_material_ref.clear_material()
                        that.material_lists = []
                    }else if(valueType == 2){
                        //清空价格和材料
                        that.tallyRecordForm.amount = '';
                        that.$refs.record_material_ref.clear_material()
                        that.material_lists = []
                    }
                    that.recordFormFileList = []
                    that.getRecordListRecent()
                }else{
                    that.showTips('error','解析数据失败:'+res.data.error_message)
                }
                that.tallyDialog = false;
            })
        },
        editRecord(row){
            let editRow = JSON.parse(JSON.stringify(row))
            if(editRow['tally_time'] !== '' ){
                let timeArr = editRow.tally_time.split(' ')
                editRow.dateR = timeArr[0]
                editRow.timeR = timeArr[1]
            }
            editRow.category_id = String(editRow.category_id )
            editRow.account_id = String(editRow.account_id )
            if(editRow.member_id  === 0) editRow.member_id = ''
            if(editRow.store_id  === 0) editRow.store_id = ''
            if(editRow.account_dst_id  === 0) editRow.account_dst_id = ''
            if(editRow.project_id  === 0) editRow.project_id = ''
            editRow.member_id = String(editRow.member_id )
            editRow.store_id = String(editRow.store_id )
            editRow.account_dst_id = String(editRow.account_dst_id )
            editRow.project_id = String(editRow.project_id )
            // 处理附件转换
            this.recordFormEditFileList=[]
            editRow.attachment.forEach(v=>{
                this.recordFormEditFileList.push({
                    name:v.id,
                    url:v.file_name
                })
            });
            if(editRow.material_json !== ''){
                editRow.material_json = JSON.parse(editRow.material_json);
            }else{
                editRow.material_json = []
            }
            this.recordForm = editRow
            this.recordDialog = true
        },
        auditRecord(row,state){
            let that = this
            let advice = state === 1 ? '同意' : '拒绝'
            let state_txt = state === 1 ? '已入账' : '已忽略'
            this.$confirm('确定要审核该行记录：'+ advice, '提示', {
                confirmButtonText: '确定',
                callback: action => {
                    if(action === 'confirm') {
                        let postUrl = '/api/tally-record/audit'
                        axios.post(postUrl,{id:row.id,state:state},{
                            headers: {'token': loginToken},
                        }).then(function(res) {
                            if(res.data.status === 'success'){
                                row.state = state
                                row.state_txt = state_txt
                                that.$message({
                                    type: 'success',
                                    message: '操作成功~'
                                })
                            }else{
                                that.$message({
                                    type: 'error',
                                    message: '解析数据失败:'+res.data.error_message
                                })
                            }
                        })
                    }
                }
            });
        },
        delRecord(index,row){
            let that = this
            this.$confirm('确定要删除该行记录', '提示', {
                confirmButtonText: '确定',
                callback: action => {
                    if(action === 'confirm') {
                        let postUrl = '/api/tally-record/del'
                        axios.post(postUrl,{id:row['id']},{
                            headers: {'token': loginToken},
                        }).then(function(res) {
                            if(res.data.status === 'success'){
                                that.$message({
                                    type: 'success',
                                    message: '操作成功~'
                                })
                                that.recordListRecent.splice(index, 1)
                            }else{
                                that.$message({
                                    type: 'error',
                                    message: '解析数据失败:'+res.data.error_message
                                })
                            }
                        })
                    }
                }
            })
        },
        selectVisibleChange(visible, refName, func) {
            let is_append = true;
            if(refName == 'projectTpl' || refName == 'accountTpl' || refName == 'accountTpl2' || refName == 'storeTpl'){
                if(this.currentTally['role'] == 'pmanger'){
                    is_append = false;
                }
            }
            if (visible && is_append) {
                const ref = this.$refs[refName]

                console.log(refName)

                let popper = ref.$refs.popper
                if (popper.$el) popper = popper.$el
                if (!Array.from(popper.children).some(v => v.className === 'el-template-menu__list')) {
                    const el = document.createElement('ul')
                    el.className = 'el-template-menu__list'
                    el.style = 'border-top:2px solid rgb(219 225 241); padding:0; color:rgb(64 158 255);font-size: 13px'
                    el.innerHTML = `<li class="el-cascader-node text-center" style="height:37px;line-height: 50px">
                <span class="el-cascader-node__label"><i class="font-blue el-icon-plus"></i> 新 增</span>
                </li>`
                    popper.appendChild(el)
                    el.onclick = func
                }
            }
        },
        selectAddCate(){
            this.categoryFormShow = true
        },
        selectAddAccount() {
            this.accountFormShow = true
        },
        selectAddMember(){
            this.memberFormShow = true
        },
        selectAddProject(){
            this.projectFormShow = true
        },
        selectAddStore(){
            this.storeFormShow = true
        },
        setTallyAddType(type){
            if(type !== this.tallyAddType) {
                this.tallyAddType = type
                this.tallyRecordForm.category_id = ''
                this.tallyRecordForm.store_id = ''
            }
        },
        showTips(type,msg){
            this.$message({
                type: type,
                message: msg
            });
        },
        smallToBig(money) {
                  //  将数字金额转换为大写金额
            var cnNums = new Array(
                "零",
                "一",
                "二",
                "三",
                "四",
                "五",
                "六",
                "七",
                "八",
                "九"
            ); //汉字的数字
            var cnIntRadice = new Array("", "十", "百", "千"); //基本单位
            var cnIntUnits = new Array("", "万", "亿", "兆"); //对应整数部分扩展单位
            var cnDecUnits = new Array("角", "分", "毫", "厘"); //对应小数部分单位
            var cnInteger = "整"; //整数金额时后面跟的字符
            var cnIntLast = "元"; //整数完以后的单位
            //最大处理的数字
            var maxNum = 999999999999999.9999;
            var integerNum; //金额整数部分
            var decimalNum; //金额小数部分
            //输出的中文金额字符串
            var chineseStr = "";
            var parts; //分离金额后用的数组，预定义
            if (money == "") {
                return "请输入金额";
            }

            money = parseFloat(money);
            if (money >= maxNum) {
                //超出最大处理数字
                return "超出最大处理数字";
            }
            if (money == 0) {
                chineseStr = cnNums[0] + cnIntLast + cnInteger;
                return chineseStr;
            }

            //四舍五入保留两位小数,转换为字符串
            money = Math.round(money * 100).toString();
            integerNum = money.substr(0, money.length - 2);
            decimalNum = money.substr(money.length - 2);

            //获取整型部分转换
            if (parseInt(integerNum, 10) > 0) {
                var zeroCount = 0;
                var IntLen = integerNum.length;
                for (var i = 0; i < IntLen; i++) {
                var n = integerNum.substr(i, 1);
                var p = IntLen - i - 1;
                var q = p / 4;
                var m = p % 4;
                if (n == "0") {
                    zeroCount++;
                } else {
                    if (zeroCount > 0) {
                    chineseStr += cnNums[0];
                    }
                    //归零
                    zeroCount = 0;
                    chineseStr += cnNums[parseInt(n)] + cnIntRadice[m];
                }
                if (m == 0 && zeroCount < 4) {
                    chineseStr += cnIntUnits[q];
                }
                }
                chineseStr += cnIntLast;
            }
            //小数部分
            if (decimalNum != "") {
                var decLen = decimalNum.length;
                for (var i = 0; i < decLen; i++) {
                var n = decimalNum.substr(i, 1);
                if (n != "0") {
                    chineseStr += cnNums[Number(n)] + cnDecUnits[i];
                }
                }
            }
            if (chineseStr == "") {
                chineseStr += cnNums[0] + cnIntLast + cnInteger;
            } else if (decimalNum == "" || /^0*$/.test(decimalNum)) {
                chineseStr += cnInteger;
            }
            return chineseStr;
        },
    }
}
</script>
